Image Editor

A lightweight graphics editor for quick asset manipulation directly within the IDE.

Tools & Shortcuts

Quickly switch between tools using single-key shortcuts:

B	Brush: Freehand drawing with adjustable size and color.
E	Eraser: Remove content from the canvas.
S	Select: Move and transform existing shapes/layers.
R / C / L	Shapes: Draw Rectangles, Circles, and Lines.
T	Text: Add text overlays.

Tool Set

Drawing: Freehand Brush with customizable color and width.
Shapes: Add vector-based Rectangles, Circles, and Triangles. These remain editable (move/scale/rotate) after placement.
Text: Add text overlays with selectable fonts and colors.
Eraser: Remove objects or erase brush strokes.

Canvas Operations

Object Management: Since the editor is vector-based (Fabric.js), you can select, move, and modify any added shape or text element individually.
Crop & Resize: Adjust the canvas dimensions to fit your needs.

Color Management

The editor features a classic palette system with Primary (Left Click) and Secondary (Right Click) color selection, ideal for filled shapes and outlines.